/*
 * @Author: xiaosihan 
 * @Date: 2024-05-28 20:36:45 
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2024-05-29 04:11:16
 */

/*
 * @Author: xiaosihan 
 * @Date: 2024-05-28 19:47:08 
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2024-05-28 20:24:39
 */


import homeStore from "@views/home/homeStore";
import { Clock, Group, Sprite, SpriteMaterial, Vector3 } from "three";
import threeLoader from "three-base/threeLoader";
import infoPointDataJSON from "./infoPointData.json";
import point1PNG from "./point1.png";
import { lowerFirst } from "lodash";
import { autorun } from "mobx";

//信息弹窗
export default class InfoPointGroup extends Group {
    constructor() {
        super();
        this.init(infoPointDataJSON)
    }

    //地图偏移量
    offset = new Vector3(-116.468994140625 * 5, 0, 40.25177764892578 * 5);

    texture = threeLoader.getTexture(point1PNG);

    material = new SpriteMaterial({
        map: this.texture,
        color: 0xfffef4,
        fog: false,
        transparent: true,
        depthTest: false,
    })

    init(infoPointDatas: Array<{ name: string, level: string, value: number, lng: number, lat: number }>) {
        this.clear();

        infoPointDatas.map((infoPointData, i) => {
            const sprite = new Sprite(this.material);

            //three事件
            sprite.userData = {
                cursor: "pointer",
                enableEvent: true,
            };

            sprite.addEventListener("click", (e: any) => {
                this.timedown = 3; // 倒计时3秒
                this.show_i = i;
                const infoData = infoPointDataJSON[this.show_i]!;
                if (infoData) {
                    homeStore.setInfoPoint(infoData);
                }
            });

            sprite.name = infoPointData.name;
            sprite.renderOrder = 23
            sprite.scale.set(0.3, 0.3, 0.3);
            let { lng, lat } = infoPointData;
            let point = new Vector3(lng, 0.1, -lat).multiplyScalar(5).add(this.offset);
            sprite.position.copy(point);
            this.add(sprite);
        })
    }

    dispose = autorun(() => {
        const { showPoint } = homeStore;
        this.children.map(o => (o.visible = showPoint));
    });

    //弹窗显示的数据
    show_i = 0;

    clock = new Clock();

    timedown = 3; // 倒计时3秒

    updateMatrixWorld(force?: boolean | undefined): void {

        this.timedown -= this.clock.getDelta();

        if (this.timedown < 0) {

            this.timedown = 3;
            this.show_i = ((this.show_i + 1) % infoPointDataJSON.length);
            const infoData = infoPointDataJSON[this.show_i]!;
            if (infoData) {
                homeStore.setInfoPoint(infoData);
            }
        }

        super.updateMatrixWorld(force);
    }

}
